﻿<div class="surface-container-high" style="height: 500px; max-width: 380px; margin: 0 auto;">
    <MSheet Class="d-flex pl-4 py-4 mb-2" Color="surface">
        <MAvatar Rounded="true" Size="64" Color="primary">
            <MIcon Size="48">$masaBlazor</MIcon>
        </MAvatar>
        <MCellGroup Dense HideDivider Class="flex-fill" CellMinHeight="32">
            <MCell Ripple="false">
                <TitleContent>
                    <h3> MASA Blazor </h3>
                </TitleContent>
                <ChildContent>
                    <MButton IconName="mdi-qrcode" Small></MButton>
                </ChildContent>
            </MCell>
            <MCell Subtitle="Weixin ID：masablazor" Href="/blazor/mobiles/cell#id" Ripple="false"></MCell>
        </MCellGroup>
    </MSheet>
    <MCellGroup>
        <MCell Title="Pay and services" Href="/blazor/mobiles/cell#service" Class="mb-2" HideDivider>
            <PrependIconContent>
                <MIcon Color="green">mdi-face-agent</MIcon>
            </PrependIconContent>
        </MCell>
        <MCell Title="Favorites" Href="/blazor/mobiles/cell#collect">
            <PrependIconContent>
                <MIcon Color="green">mdi-rhombus-split</MIcon>
            </PrependIconContent>
        </MCell>
        <MCell Title="My Posts" Href="/blazor/mobiles/cell#moments">
            <PrependIconContent>
                <MIcon Color="blue">mdi-image-area</MIcon>
            </PrependIconContent>
        </MCell>
        <MCell Title="Cards & Offers" Href="/blazor/mobiles/cell#card">
            <PrependIconContent>
                <MIcon Color="cyan">mdi-credit-card</MIcon>
            </PrependIconContent>
        </MCell>
        <MCell Title="Sticker Gallery" Href="/blazor/mobiles/cell#emoji" Class="mb-2" HideDivider>
            <PrependIconContent>
                <MIcon Color="yellow">mdi-emoticon</MIcon>
            </PrependIconContent>
        </MCell>
        <MCell Title="Settings" PrependIcon="mdi-cog" Href="/blazor/mobiles/cell#setting"/>
    </MCellGroup>
</div>
